<template lang="pug">
  .black-dialog(v-if="blackInfo.show")
    .black-dialog-content
      span {{blackInfo.text || '保存成功'}}
</template>

<script>
import {get} from '@utils/util'
export default {
  computed: {
    blackInfo: get('dialog/blackInfo')
  },
  watch: {
    'blackInfo.show': function (val) {
      if (val) {
        setTimeout(() => {
          this.$store.set('dialog/blackInfo', {
            show: false,
            text: ''
          })
        }, 2000)
      }
    }
  }
}
</script>

<style scoped lang="stylus">
  .black-dialog
    width 100%
    height 100%
    position fixed
    left 0
    top 0
    display flex
    flex-direction row
    justify-content center
    align-items center
    z-index 90001
  .black-dialog-content
    min-width 134px
    height 80px
    background-color rgba(0, 0, 0, .7)
    font-size 18px
    text-align center
    line-height 80px
    color #fff
    border-radius 8px
    padding 0 20px
</style>
